Framing (World Wide Web)

When using web browsers, the terms frames or frameset refer to the display of two or more web pages or media elements displayed side-by-side within the same browser window. The term framing however refers to the fraudulent display of information of one web site's data within another web site's page,[1][2] fraudulent meaning intentionally using some form of trickery in order to receive unfair or unlawful gain. A frameset is the technical HTML term for a group of named frames to which web pages and media can be directed. The web or media elements that go in a frame may come from the same web site or from multiple web sites. There are multiple ways to accomplish this side-by-side arrangement of web pages. There is significant value in specialized HTML code for creating side-by-side information displays for reasons of improved user readability and comprehension, reduction in the data transmission load on the Internet and expanded options for authors addressing more complex subjects.

Some concerns about this long-standing frameset feature of the HTML 3.0 and HTML 4.0 standards have led to its removal from the HTML 5.0 standard (except for iframes). Replacements include XFrames (still a W3C "working draft" as of 2010), or the use of CSS (Cascading Style Sheets), server-side includes, and scripting languages such as PHP.

Contents

Value

The commonly understood rationale for frame pages, simplifying web site and web page navigation, has a widely used replacement within CSS (Cascading Style Sheets). However, where many have seen this as the only useful rationale for frame pages, there are other more important reasons for side-by-side display of web pages and media and the incorporation of such design within HTML code, not in some separate coding stored in yet another web file.

The common rationale for the creation of a frameset (e.g., using two or more web pages or media elements) is for the purpose of simplifying navigation and the editing of the navigation data.[3] If an item needs to be added to a sidebar navigation menu, the web page author needs to change only one web page file, whereas each individual page on a traditional non-frameset website would have to be edited if the sidebar menu appeared on all of them. In a frameset, each frame displays a different HTML document. Frames containing headers and sidebar menus do not move when data targeted to content frames is viewed or scrolled up and down. More importantly for users, the data for web page navigation is transmitted only once, which makes for faster web page display for readers and reduces the data transmission load on the Internet, in contrast to CSS which must resend the navigation data for every page that needs it.

A more powerful rationale for the parallel display of frame elements is their use in making comparisons. When items are compared, it is often useful to place them side by side. This might include the side-by-side comparison of two pictures or videos. Another form of comparison provides a way to compare two different ways to understand something, such as putting descriptive information alongside the element or elements being viewed and used, such as an independently scrolling page of text next to video, images, animation, 3D rotating objects, etc. This design is also useful for putting footnote and reference information alongside the paragraph that is citing a reference, a reference which can contain a link providing immediate alongside display of the actual source of the information. Further, many web page elements are interactive, so description of and directions for manipulation of interactive elements in the parallel frame or frames can easily be followed. In addition, web page readers can be concerned that they will lose their place on one web page as they follow related links, but display in a frameset side page keeps the reader's paragraph or original display of information in constant view. In short, the frameset model can be used to improve the readability and therefore comprehension of an author's compositions, especially more complex ideas.

The simple alternative for a side-by-side look at things is to embed the element of information being discussed within a single web page, with the result that if the description is not kept very short, the media element being described scrolls off the page while the description is being read. Web table structures can also be used to put things side by side, but face the same potential problem of scrolling away the item such as an image when the descriptive and comparative information becomes longer. A more complex alternative to side-by-side display requires specialized coding of some kind such CSS or PHP.

History

Netscape Navigator 2.0 introduced the elements used for frames in March 1996. Other browser vendors such as Apple with Cyberdog followed later the year.[4] At that time, Netscape proposed frames to the World Wide Web Consortium (W3C) for inclusion in the HTML 3.0 standard.[5]

Framing was used to display and navigate early e-zines.

In late 2011 frame-like user interface features began appearing on various well maintained websites. As part of the major changes to the look and feel of Google's products in late 2011, separate scrolling bars for chat and mail windows in Gmail as well as search style bars that stick to the top of the screen for Google books. Pandora changed their music player to one that has a separate frame at the top of the screen showing the basic player buttons and information about the song.

Syntax

The frameset is used instead of the <body> and </body> tags. Rows and cols attributes can be used to describe the dimensions of the frames in comma-separated lists of sizes (in pixels or percentages). If the percentages do not add to 100 the browser should adjust the sizes proportionally. Any row or column size may be replaced with an asterisk to indicate the remainder of the remaining screen space.[6] Within the frameset, the framed panels are described with their source documents. The <noframes> element may be included so browsers with frames disabled (or browsers that don't support frames) can display something to the user, as in this example:

<frameset cols="85%, 15%">
  <frame src="URL OF FRAME PAGE 1 HERE">
  <frame src="URL OF FRAME PAGE 2 HERE">
  <noframes>
    Text to be displayed in browsers that do not support frames
  </noframes>
</frameset>

Content sources

The contents of the frames may be hosted on the same server as the parent page, or it may link in code from another website server such that these external contents are automatically displayed within the frame (transclusion or remote loading).

Critique

A summary of the criticisms of the practice of framing HTML content includes:

This behaviour could be mitigated by:
  • disabling scrolling for smaller frames that typically didn't require a scrollbar;
  • using fluid design characteristics in target pages instead of fixed designs, so that the content wouldn't cause horizontal scrollbars in the first place.

Replacements

Although frames were included in the XHTML 1.0 specification, they were not carried across to XHTML 1.1. The intended eventual replacement is XFrames,[13] which attempts to solve the problem of addressing a populated frameset through composite URIs. For those serving web content under the XHTML 1.0 specification, documents may be embedded within one another via either the object or iframe element tags. Under the 1.1 specification, iframe was removed, leaving only the object element for transclusion until browsers begin support for XFrames. Unfortunately, Internet Explorer 7 does not handle objects used to replace the function of an iframe, it doesn't recognize that a link from within the included page has the containing page as its _parent. Therefore constructing a menu to be included on every page, in imitation of a frameset, fails as the parent frame cannot be targeted. However most of the layout engines work perfectly well with this construct, some examples are: KHTML (Konqueror), WebKit (Safari and Google Chrome) and Gecko (Mozilla Firefox)

Frames become invalid in HTML5,[14] with the exception that iframes remain.[15]

See also

References

  1. ^ "Nolo’s Plain-English Law Dictionary". http://www.nolo.com/dictionary/framing-term.html. 
  2. ^ "Deep Linking, Framing, Inlining and Extension of Copyrights: Recent Cases in Common Law Jurisdictions". http://www.murdoch.edu.au/elaw/issues/v11n1/meyer111.html. 
  3. ^ "Framesets". http://www.howtocreate.co.uk/tutorials/html/framesets. 
  4. ^ Garaffa, Dave (23 December 1996). "A Present From Apple: Cyberdog 2.0a1" (Press release). Internet.com. Archived from the original on 17 August 2000. http://web.archive.org/web/20000817100726/browserwatch.internet.com/news/story/apple33.html. Retrieved 14 April 2011. 
  5. ^ Ladd, Eric. "Using HTML 3.2, Java 1.1, and CGI; Ch. 13, Frames". Archived from the original on 30 October 2007. http://replay.waybackmachine.org/20071030083252/http://docs.rinet.ru/HTMLnya/ch13.htm. 
  6. ^ "Frames in HTML Documents". W3C. http://www.w3.org/TR/REC-html40/present/frames.html. 
  7. ^ a b Nielsen, Jakob (December 1996). "Frames Suck Most of the Time". http://www.useit.com/alertbox/9612.html. 
  8. ^ http://www.htmlcodetutorial.com/frames/frames_famsupp_15.html HTML Code Tutorial
  9. ^ "G.E.Boyd's How To Do Just About Anything by email - Part 1". GeoCities. 11 August 2000. Archived from the original on 17 August 2000. http://web.archive.org/web/20000817030717/http://www.geocities.com/CapitolHill/1236/howto1.html. Retrieved 24 June 2010. 
  10. ^ "I Hate Frames Club". http://budugllydesign.com/frame9806/frames9.htm. 
  11. ^ a b "Why are frames so evil?". http://www.html-faq.com/htmlframes/?framesareevil. 
  12. ^ a b "The Pros and Cons of Frames in Web Pages". http://www.mediacollege.com/internet/html/frames/pros-cons.html. 
  13. ^ "XFrames working draft". W3C. http://www.w3.org/TR/xframes/. 
  14. ^ HTML 5 differences from HTML 4: "The following elements are not in HTML 5 because their usage affected usability and accessibility for the end user in a negative way: frame, frameset, noframes"
  15. ^ HTML 5 differences from HTML 4: "new sandboxing features for iframe"

External links